<script setup lang='ts'>

</script>

<template>
    <div class="mx-auto my-0 w-1300">
        <div class="p-20 bg-#ccc">
            <el-row :gutter="20">
                <el-col :span="8">
                    <div class="mb-20 bg-red h-50 w-100" />

                    <div class="">
                        安居链基于地产行业领先的集采价格优势、40余年建
                        材供应链管理经验，建立公开透明、优质低价、便捷高效
                        的交易模式和资源共享平台。安居链整合产业链上下游资
                        源，将产品质量、服务能力、管控标准、大数据、资本能
                        力真实沉淀，打造中国建材产业互联共赢生态平台。
                    </div>
                </el-col>

                <el-col :span="8">
                    <div class="mt-20 flex justify-between">
                        <div class="text-center">
                            <div class="mb-10 bg-red h-100 w-100" />

                            <div>xxxxxx</div>
                        </div>

                        <div class="text-center">
                            <div class="mb-10 bg-red h-100 w-100" />

                            <div>xxxxxx</div>
                        </div>

                        <div class="text-center">
                            <div class="mb-10 bg-red h-100 w-100" />

                            <div>xxxxxx</div>
                        </div>
                    </div>
                </el-col>

                <el-col :span="8">
                    <div class="mt-20 flex gap-10">
                        <div class="text-center">
                            <div class="mb-5 text-14 text-#000 font-600">
                                如何入驻
                            </div>

                            <ul class="text-12 text-#666">
                                <li>线上注册</li>

                                <li>企业认证</li>
                            </ul>
                        </div>

                        <div class="text-center">
                            <div class="mb-5 text-14 text-#000 font-600">
                                如何下单
                            </div>

                            <ul class="text-12 text-#666">
                                <li>下单流程</li>

                                <li>订单状态</li>
                            </ul>
                        </div>

                        <div class="text-center">
                            <div class="mb-5 text-14 text-#000 font-600">
                                如何支付
                            </div>

                            <ul class="text-12 text-#666">
                                <li>网上支付</li>

                                <li>银行转账</li>
                            </ul>
                        </div>

                        <div class="text-center">
                            <div class="mb-5 text-14 text-#000 font-600">
                                售后服务
                            </div>

                            <ul class="text-12 text-#666">
                                <li>如何换货</li>
                            </ul>
                        </div>

                        <div class="text-center">
                            <div class="mb-5 text-14 text-#000 font-600">
                                加入安居链
                            </div>

                            <ul class="text-12 text-#666">
                                <li>入住安居链</li>
                            </ul>
                        </div>

                        <div class="text-center">
                            <div class="mb-5 text-14 text-#000 font-600">
                                关于安居链
                            </div>

                            <ul class="text-12 text-#666">
                                <li>关于我们</li>

                                <li>隐私政策</li>

                                <li>新闻中心</li>
                            </ul>
                        </div>
                    </div>
                </el-col>
            </el-row>
        </div>

        <div class="p-20 bg-#222222 text-#fff flex flex-col justify-center items-center">
            <div class="mb-10 flex items-center">
                商城首页
                <div class="mx-16 bg-#fff h-16 w-1" />
                关于我们
                <div class="mx-16 bg-#fff h-16 w-1" />
                新闻中心
            </div>

            <div class="text-#fff/60 flex gap-20 items-center">
                <div>xxxxxxxxx</div>

                <div>xxxxxxxxx</div>

                <div>xxxxxxxxx</div>
            </div>
        </div>
    </div>
</template>

<style scoped>
li {
    margin-bottom: 8px;
    cursor: pointer;
}
</style>
